﻿@using SH = EMoney.IStock.Client.Framework.StringHelper;

@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>题材领涨-详情</title>
    <script type="text/javascript">if (top.window.location.href != window.location.href) { top.window.location.href = window.location.href }</script>
    <link rel="stylesheet" type="text/css" href="@ViewBag.PageCss" id="linkcss" />
</head>
<body>
    <div class="mr_cnt">
        <div class="mr_p">
            <div class="mr_box">
                <div class="pack " id="upPart">
                    <div class="showp">
                        <div style="height:20px;border-left:4px solid #548de8;margin-left:15px;">
                            <div style="float:left;margin-left:15px;">
                                <h2 style="font-size:13px;font-weight:bold;">成功率 </h2>
                            </div>
                            <a href="javascript:;" onclick="gopool();"><div class="clpool1" style="float:right;margin-top:5px;margin-right:10px;"></div></a>
                        </div>
                        <br />
                        <div class="clr"></div>
                        <div class="showp_c">
                            <div class="p">
                                <div class="cvChrtP">
                                    <div id="divpie" style="/*width: 735px;*/ height: 199px;">
                                    </div>
                                </div>
                                <div class="subtit">每季度的月涨幅>5%的股票占比</div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="pack">
                    <div class="showp">
                        <div style="height:20px;border-left:4px solid #548de8;margin-left:15px;">
                            <div style="float:left;margin-left:15px;">
                                <h2 style="font-size:13px;font-weight:bold;">策略战绩</h2>
                            </div>
                        </div>
                        <div class="showp_c">
                            <div class="p">
                                <div class="stab0">
                                    <table id="DTable" width="100%" border="0" cellspacing="0" cellpadding="0">
                                        <thead>
                                            <tr style="height: 30px;cursor: pointer;">
                                                <th style="width:20%;" flag="SecuAbbr" scope="col">股票名称<span>↓</span></th>
                                                <th style="width:20%;" flag="DATE" scope="col">入选日期<span>↓</span></th>
                                                <th style="width:40%;" flag="REASON" scope="col">事件<span>↓</span></th>
                                                <th style="width:20%;" flag="closerise" class="selcol" scope="col">最大涨幅（%）<span>↓</span></th>
                                            </tr>
                                        </thead>
                                    </table>
                                    <div id="scrollBox1" class="scrollBox" scrollflag>
                                        <table width="100%" id="tabpilou1" border="0" cellspacing="0" cellpadding="0">
                                            <thead style="height: 0px; display: none;">
                                                <tr style="height: 30px;cursor: pointer;">
                                                    <th style="width:20%;" flag="SecuAbbr" scope="col">股票名称<span>↓</span></th>
                                                    <th style="width:20%;" flag="DATE" scope="col">入选日期<span>↓</span></th>
                                                    <th style="width:40%;" flag="REASON" scope="col">事件<span>↓</span></th>
                                                    <th style="width:20%;" flag="closerise" class="selcol" scope="col">最大涨幅（%）<span>↓</span></th>
                                                </tr>
                                            </thead>
                                            <tbody id="recordBody">
                                                <tr>
                                                    <td colspan="8">数据加载中...</td>
                                                </tr>
                                            </tbody>
                                        </table>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
        </div>
    </div>
    <input type="hidden" id="hidColor" value="@ViewBag.Color" />
</body>
</html>
<script src="http://static.emoney.cn/js/libs/jquery.min.1.8.3.js" type="text/javascript"></script>
<script src="@SH.GetStaticFile("IStockClientStatic/js/common.js")" type="text/javascript"></script>
<script src="@SH.GetStaticFile("IStockClientStatic/js/tacScroll.js")" type="text/javascript"></script>
<script src="@SH.GetStaticFile("IStockClientStatic/js/istockfunc.js")" type="text/javascript"></script>
<script src="@SH.GetStaticFile("IStockClientStatic/js/highstock.js")" type="text/javascript"></script>
<script src="@SH.GetStaticFile("IStockClientStatic/js/HStheme0.js")" type="text/javascript"></script>
<script type="text/javascript">
    var www = "@Url.Content("~/")";
    var $clkTab = $("#DTable"), $sortab = $("#tabpilou1"), htmlTbody = $("tbody", $sortab), $clkTab_th = $("thead tr th", $clkTab),
        $clknum, sortFlag = "closerise", sortType = "desc", htheadth = $("#DTable thead tr th"), allcode = "", hidColor = $("#hidColor").val();

    $(window).ready(function () {
        $("#scrollBox1").height($(window).height() - $("#upPart").height() - 105);

        $(window).bind('load resize', '', function () {
            $(document).queue(function () {
                $(document).dequeue();
                var winH = $(window).height(), winW = $(window).width();
                //$("#scrollBox0").height(winH - 82);
                $("#scrollBox1").height(winH - $("#upPart").height() - 105);
                ReSetScroll();

                stab0BorderBottom()
                //$(".scrollBox .jscroll-e").delay(800).fadeOut('slow');
            });
        });

        $(".scrollBox").jscroll({ W: "8px", IW: "8px", CurrT: 0, Bar: { Pos: "up" }, Btn: { btn: false }, Fn: function () { } }).hover(function (e) {
            var thisbx = $(this), scrlbr = $(this).find(".jscroll-e");
            if (!scrlbr.hasClass("non")) {
                scrlbr.addClass("mon").stop(true, true, false).show();
            }
        }, function (e) {
            var thisbx = $(this), scrlbr = $(this).find(".jscroll-e");
            if (!scrlbr.hasClass("non")) {
                scrlbr.removeClass("mon");
                if (scrlbr.hasClass("vxdrag")) { } else {
                    //scrlbr.fadeOut("slow");
                }
            }
        });

        ReSetScroll();

        $clkTab_th.click(function () {//↓↑
            $clknum = $clkTab_th.index(this);
            var curFlag = $(this).attr("flag");

            if (curFlag == sortFlag) {
                if (sortType == "desc") {
                    sortType = "asc";
                }
                else {
                    sortType = "desc";
                }
            }
            else {
                sortFlag = curFlag;
                sortType = "desc";
            }

            switch (sortType) {
                case "desc":
                    $("span:visible", $(this)).text("↓");
                    break;
                default:
                    $("span:visible", $(this)).text("↑");
                    break;
            }

            $(this).addClass("selcol").siblings().removeClass("selcol");

            getRecord();
        });

        $("#tabpilou1").delegate("tr", "mouseenter", function () {
            $(this).addClass("hover");
        }).delegate("tr", "mouseleave", function () {
            $(this).removeClass("hover");
        }).delegate("tr", "click", function () {
            if ($(this).attr("onshow") != undefined && $(this).attr("onshow") != "") {
                SyncGoods($(this).attr("onshow"), $(this).attr("trigger_date"));
                $("#tabpilou1 tr").removeClass("sel");
                $(this).addClass("sel");
            }
        }).delegate("tr", "dblclick", function () {
            if ($(this).attr("onshow") != undefined && $(this).attr("onshow") != "") {
                GroupToKLine("题材领涨", $(this).attr("onshow"), allcode);
            }
        });

        ReSetScroll();

        getRecord();

        initChart();
    });

    function stab0BorderBottom()
    {
        if ($("#tabpilou1").height() < $("#scrollBox1").height()) {
            $(".stab0").css("border-bottom", "none");
        }
        else {
            var borderBottom = "";
            switch (hidColor) {
                case "default":
                    borderBottom = "1px solid #D6D6D6";
                    break;
                case "black":
                    borderBottom = "1px solid #3E3E3E";
                    break;
                default:

            }

            if (borderBottom != "") {
                $(".stab0").css("border-bottom", borderBottom);
            }
        }
    }

    function getRecord()
    {
        $.ajax({
            type: "get",
            url: www + "tcxg/GetTclzRecord",
            data: { sortFlag: sortFlag, sortType: sortType },
            datatype: "text",
            success: function (data) {
                if (data != "") {
                    var obj = eval('(' + data + ')');

                    if (obj != null && obj.length > 0) {
                        var index = 1, recordHtml = "";
                        
                        $.each(obj, function (i) {
                            allcode += obj[i].SecuCode + ",";
                            recordHtml += "<tr onshow=\"" + obj[i].SecuCode + "\" trigger_date='" + parseDate(obj[i].DATE, "yyyyMMdd") + "' style=\"cursor:pointer;\">";
                            recordHtml += "<td class=\"cy4\" style='text-align:center;width:20%;'>" + obj[i].SecuAbbr + "</td>";
                            recordHtml += "<td style='text-align:center;width:20%;'>" + parseDate(obj[i].DATE) + "</td>";
                            recordHtml += "<td style='text-align:center;width:40%;'>" + obj[i].REASON + "</td>";
                            recordHtml += "<td style='text-align:center;width:20%;' class=\"cr3\">" + formatFloat(obj[i].closerise * 100) + "</td>";
                            recordHtml += "</tr>";

                            index++;
                        });

                        $("#recordBody").html(recordHtml);
                        $("#tabpilou1 tr:eq(1)").click();

                        ReSetScroll();

                        stab0BorderBottom()
                    }
                }
            },
            beforeSend: function () {
                allcode = "";
                //$("#divR").html("数据加载中...");
            },
            error: function (XMLHttpRequest, textStatus, errorThrown) {
                //alert(XMLHttpRequest.status);
            }
        });
    }

    function initChart() {
        $.ajax({
            type: "get",
            url: www + "tcxg/GetTclzSuccessrate",
            data: {},
            dataType: "text",
            success: function (data) {
                if (data != "") {
                    try {
                        var obj = eval('(' + data + ')');

                        if (obj != null && obj.length > 0) {
                            var arrxAxis = [];
                            var seriesOver = [];
                            var seriesDown = [];

                            $.each(obj, function (i) {
                                arrxAxis.push(obj[i].The_year + obj[i].Quarter);
                                seriesOver.push(obj[i].OverFivePer);
                                seriesDown.push(obj[i].DownFivePer);
                            });

                            var chart = new Highcharts.Chart({
                                chart: {
                                    renderTo: 'divpie',
                                    type: 'column',
                                    backgroundColor: 'rgba(0,0,0,0)'
                                },
                                colors: ['#F83A08', '#BFBFBF'],
                                title: {
                                    text: ''
                                },
                                xAxis: {
                                    categories: arrxAxis
                                    //categories: ['2012Q1', '2012Q2', '2012Q3', '2012Q4', '2013Q1', '2013Q2', '2013Q3']
                                },
                                yAxis: {
                                    min: 0,
                                    title: {
                                        text: ''
                                    }
                                    , plotBands: false
                                     , labels: {
                                         formatter: function () {
                                             var showValue = this.value;
                                             if (showValue == 0) {
                                                 return '<span style="">' + showValue + '</span>';
                                             } else if (showValue > 0) {
                                                 return '<span style="color:#FF5E5C;">' + showValue + '</span>';
                                             } else {
                                                 return '<span style="color:#02FF62;">' + showValue + '</span>';
                                             }
                                         }
                                     }
                                },
                                legend: {
                                    enabled: false
                                },
                                tooltip: {
                                    formatter: function () {
                                        return '<b>' + this.x + '</b><br/>' +
                                            this.series.name + ': ' + this.y + '<br/>' +
                                            '总数量: ' + this.point.stackTotal + '<br/>' +
                                            '占比: ' + ((this.y / this.point.stackTotal) * 100).toFixed(2) + "%";
                                    }
                                },
                                plotOptions: {
                                    column: {
                                        stacking: 'normal',
                                        borderWidth: 0
                                    }
                                },
                                series: [{
                                    name: '大于5%股票数量',
                                    data: seriesOver//[266, 331, 336, 297, 168, 148, 40]
                                }, {
                                    name: '小于5%股票数量',
                                    data: seriesDown//[20, 63, 44, 19, 27, 34, 32]
                                }]
                            });
                        }
                    } catch (e) {
                        alert(e.message);
                    }
                }
            },
            error: function (XMLHttpRequest, textStatus, errorThrown) {
                alert(XMLHttpRequest.status);
            }
        });
    }

    function OnSkinChanged(skinName) {
        var cssHref = "";

        switch (skinName) {
            case "default":
                hidColor = skinName;
                cssHref = "@SH.GetStaticFile("IStockClientStatic/tcxg/css/tcxg_tint.css")";
                break;
            case "black":
                hidColor = skinName;
                cssHref = "@SH.GetStaticFile("IStockClientStatic/tcxg/css/tcxg.css")";
                break;
            default:
                break;
        }

        if (cssHref != "") {
            $("#linkcss").attr("href", cssHref);
        }

        stab0BorderBottom()
    }

    function gopool() {
        window.location.href = www + "tcxg/tclz?color=" + hidColor;
    }
</script>